<template>
	<tm-app ref="app">
		<tm-navbar title="帮手时间安排" color="orange" linear="right" beforeBack="true" hideHome="false"></tm-navbar>
		<tm-sheet>
			<tm-text :font-size="30" _class="font-weight-b" :label="nowDate"></tm-text>
			<tm-divider></tm-divider>
			<view class="flex-row flex flex-wrap">
				<view v-for="(item,index) in daytimelist" :key="index">
				<tm-tag v-if="item.status == '0'" @click="upBsTimeStatus(nowDate,item['status'],item['time'])" checkable color="orange" size="n" :label="item.time"></tm-tag>
				<tm-tag v-if="item.status == '1'" @click="upBsTimeStatus(nowDate,item['status'],item['time'])" color="orange" size="n" :label="item.time"></tm-tag>
				</view>
			</view>
		</tm-sheet>
		<tm-sheet>
			<tm-text :font-size="30" _class="font-weight-b" :label="nextDate"></tm-text>
			<tm-divider></tm-divider>
			<view class="flex-row flex flex-wrap">
				<view v-for="(item,index) in nextdaytimelist" :key="index">
				<tm-tag v-if="item.status == '0'" @click="upBsTimeStatus(nextDate,item['status'],item['time'])" checkable color="orange" size="n" :label="item.time"></tm-tag>
				<tm-tag v-if="item.status == '1'" @click="upBsTimeStatus(nextDate,item['status'],item['time'])" color="orange" size="n" :label="item.time"></tm-tag>
				</view>
			</view>
		</tm-sheet>
		
		
		<tm-sheet>
			<tm-text :font-size="30" _class="font-weight-b" :label="threeDate"></tm-text>
			<tm-divider></tm-divider>
			<view class="flex-row flex flex-wrap">
				<view v-for="(item,index) in threedaytimelist" :key="index">
				<tm-tag v-if="item.status == '0'" @click="upBsTimeStatus(threeDate,item['status'],item['time'])" checkable color="orange" size="n" :label="item.time"></tm-tag>
				<tm-tag v-if="item.status == '1'" @click="upBsTimeStatus(threeDate,item['status'],item['time'])" color="orange" size="n" :label="item.time"></tm-tag>
				</view>
			</view>
		</tm-sheet>
		<tm-sheet>
			<tm-text :font-size="30" _class="font-weight-b" :label="fourDate"></tm-text>
			<tm-divider></tm-divider>
			<view class="flex-row flex flex-wrap">
				<view v-for="(item,index) in fourdaytimelist" :key="index">
				<tm-tag v-if="item.status == '0'" @click="upBsTimeStatus(fourDate,item['status'],item['time'])" checkable color="orange" size="n" :label="item.time"></tm-tag>
				<tm-tag v-if="item.status == '1'" @click="upBsTimeStatus(fourDate,item['status'],item['time'])" color="orange" size="n" :label="item.time"></tm-tag>
				</view>
			</view>
		</tm-sheet>
		<tm-sheet>
			<tm-text :font-size="30" _class="font-weight-b" :label="fiveDate"></tm-text>
			<tm-divider></tm-divider>
			<view class="flex-row flex flex-wrap">
				<view v-for="(item,index) in fivedaytimelist" :key="index">
				<tm-tag v-if="item.status == '0'" @click="upBsTimeStatus(fiveDate,item['status'],item['time'])" checkable color="orange" size="n" :label="item.time"></tm-tag>
				<tm-tag v-if="item.status == '1'" @click="upBsTimeStatus(fiveDate,item['status'],item['time'])" color="orange" size="n" :label="item.time"></tm-tag>
				</view>
			</view>
		</tm-sheet>
		<tm-sheet>
			<tm-text :font-size="30" _class="font-weight-b" :label="sixeDate"></tm-text>
			<tm-divider></tm-divider>
			<view class="flex-row flex flex-wrap">
				<view v-for="(item,index) in sixedaytimelist" :key="index">
				<tm-tag v-if="item.status == '0'" @click="upBsTimeStatus(sixeDate,item['status'],item['time'])" checkable color="orange" size="n" :label="item.time"></tm-tag>
				<tm-tag v-if="item.status == '1'" @click="upBsTimeStatus(sixeDate,item['status'],item['time'])" color="orange" size="n" :label="item.time"></tm-tag>
				</view>
			</view>
		</tm-sheet>
		<tm-sheet>
			<tm-text :font-size="30" _class="font-weight-b" :label="sevenDate"></tm-text>
			<tm-divider></tm-divider>
			<view class="flex-row flex flex-wrap">
				<view v-for="(item,index) in sevendaytimelist" :key="index">
				<tm-tag v-if="item.status == '0'" @click="upBsTimeStatus(sevenDate,item['status'],item['time'])" checkable color="orange" size="n" :label="item.time"></tm-tag>
				<tm-tag v-if="item.status == '1'" @click="upBsTimeStatus(sevenDate,item['status'],item['time'])" color="orange" size="n" :label="item.time"></tm-tag>
				</view>
			</view>
		</tm-sheet>
		
		
	</tm-app>
</template>

<script lang="ts" setup>
	import { ref } from "vue"
	import { onLoad } from "@dcloudio/uni-app"
	import { isEmpty } from "@/tmui/tool/function/util";
	import { getDateJSON, inBsTimeData, updateBsTimestatus, showBsTimeDataForDate } from "@/api/kcsjap"
	
	
	const daytimelist = ref([]);// 1
	const nextdaytimelist = ref([]);// 2
	const threedaytimelist = ref([]);// 3
	const fourdaytimelist = ref([]);// 4
	const fivedaytimelist = ref([]);// 5
	const sixedaytimelist = ref([]);// 6
	const sevendaytimelist = ref([]);// 7
	
	const nowDate = ref("");
	const nextDate = ref("");
	const threeDate = ref("");
	const fourDate = ref("");
	const fiveDate = ref("");
	const sixeDate = ref("");
	const sevenDate = ref("");
	
	const userid = ref("");
	
	onLoad(() => {
		userid.value = uni.getStorageSync("userid");
		// console.log('初始化程序加载数据！', userid.value);
		if (isEmpty(userid.value)) {
			uni.redirectTo({
				url: '/pages/auth/auth'
			})
		}
		// 进行初始化两天的数据
		loadData();
		
		
		
		
	})
	
	const loadData = async () => {
		let param = {"userid":userid.value};
		await inBsTimeData(param);
		// 获取日期
		queryDateJSON();
	}
	
	const queryDateJSON = async () => {
		const result = await getDateJSON();
		// console.log(JSON.stringify(result));
		nowDate.value = result.nowDate;// 服务器的当前日期
		nextDate.value = result.nextDate;// 服务器的第二天日期
		threeDate.value = result.threeDate;// 3
		fourDate.value = result.fourDate;// 4
		fiveDate.value = result.fiveDate;// 5
		sixeDate.value = result.sixeDate;// 6
		sevenDate.value = result.sevenDate;// 7
		
		// 进行获取展示数据
		showNowDateData(result.nowDate);
		showNextDateData(result.nextDate,"2");
		showNextDateData(result.threeDate,"3");
		showNextDateData(result.fourDate,"4");
		showNextDateData(result.fiveDate,"5");
		showNextDateData(result.sixeDate,"6");
		showNextDateData(result.sevenDate,"7");
	}
	
	const showNowDateData = async (date : string) => {
		let param = {"userid":userid.value,"date":date}
		const result = await showBsTimeDataForDate(param);
		daytimelist.value = result;
	}
	
	const showNextDateData = async (date : string,days:string) => {
		let param = {"userid":userid.value,"date":date}
		const result = await showBsTimeDataForDate(param);
		console.log(date,days,JSON.stringify(result));
		if(days === "2"){
			nextdaytimelist.value = result;
		}
		if(days === "3"){
			threedaytimelist.value = result;
		}
		if(days === "4"){
			fourdaytimelist.value = result;
		}
		if(days === "5"){
			fivedaytimelist.value = result;
		}
		if(days === "6"){
			sixedaytimelist.value = result;
		}
		if(days === "7"){
			sevendaytimelist.value = result;
		}
	}
	
	
	
	function upBsTimeStatus(date : string,status : string,time : string){
		// 进行更新学时的数据库状态
		upBsTimestatus(date,status,time);
		if(date === nowDate.value){
			setTimeout(function(){
				showNowDateData(date);
			},2000);
		}
		
		if(date === nextDate.value){
			setTimeout(function(){
				showNextDateData(date,"2");
			},2000);
		}
		
		if(date === threeDate.value){
			setTimeout(function(){
				showNextDateData(date,"3");
			},2000);
		}
		
		if(date === fourDate.value){
			setTimeout(function(){
				showNextDateData(date,"4");
			},2000);
		}
		
		if(date === fiveDate.value){
			setTimeout(function(){
				showNextDateData(date,"5");
			},2000);
		}
		
		if(date === sixeDate.value){
			setTimeout(function(){
				showNextDateData(date,"6");
			},2000);
		}
		
		if(date === sevenDate.value){
			setTimeout(function(){
				showNextDateData(date,"7");
			},2000);
		}
	}
	
	const upBsTimestatus = async (date : string,status : string,time : string) => {
		let param = {"userid":userid.value,"date":date,"status":status,"time":time};
		// console.log(JSON.stringify(param));
		await updateBsTimestatus(param);
	}
	
</script>